<template>
	<view class="cd-detail">
		<!-- 品牌详情页 -->
		<view class="cd-detail-wrap">
			<view class="cd-detail-item">
				<image class="cd-detail-item-img" :src="brand.list_pic_url" mode="widthFix">
					<text class="cd-detail-item-name">{{brand.name}}</text>
				</image>
			</view>
			<view class="cd-detail-item-desc">
				{{brand.simple_desc}}
			</view>
		</view>
		<!-- 网页后退 -->
		<pageBack></pageBack>
	</view>
</template>

<script>
	import {
		ApiBrandlLhx,
	} from '../../utils/api.js';
	import pageBack from '@/components/pageBack/pageBack.vue'
	export default {
		data() {
			return {
				brand: {}
			}
		},
		components: {
			pageBack
		},
		async onLoad(option) {
			let res = await ApiBrandlLhx({
				id: option.id
			});
			console.log(res)
			let {
				brand
			} = res.data
			this.brand = brand
		},
		methods: {

		}
	}
</script>

<style lang="scss">
	page {
		background-color: #efefef;
	}

	.cd-detail-item {
		position: relative;
		width: 100%;

		.cd-detail-item-img {
			width: 100%;
			position: relative;
			display: block;
		}

		.cd-detail-item-name {
			position: absolute;
			left: 0;
			top: 0;
			right: 0;
			bottom: 0;
			width: 100%;
			text-align: center;
			height: 60rpx;
			line-height: 60rpx;
			margin: auto;
			font-size: 40rpx;
			text-decoration: underline;
			color: white;
		}
	}

	.cd-detail-item-desc {
		background: #fff;
		font-size: 18px;
		text-align: center;
		padding: 20px 10px;
		line-height: 26px;
		color: #666;
	}
</style>
